import {IhighPost} from '@/utils/highPost'
import {highPostlist,selectStationNewVersionList} from "@/services/index"
import { useState, useEffect } from 'react'
import style from './highPost.less'
import { Input, Table,} from 'antd';


const highPost:React.FC=()=>{
    const { Search } = Input;
    // 专业初始数据
    const [ list,setlist ] =useState<IhighPost[]>([])
    // 专业初始高亮下标
    const [ id,setid ] =useState(0)
    // 请求接口的初始参数
    const [ params,setparams ] = useState({pageNum: '1',pageSize: '10',searchTitle:'' ,majorId: ''})
    // 搜索
    const onSearch = (value: any) => {
        setparams({...params,searchTitle:value})
        value=''
    };
    // 表格内容
    const [dataSource ,setdataSource] = useState<any>([]);
      
      const columns = [
        {
          title: '姓名',
          dataIndex: 'name',
          key: 'name',
        },
        {
          title: '年龄',
          dataIndex: 'age',
          key: 'age',
        },
        {
          title: '住址',
          dataIndex: 'address',
          key: 'address',
        },
      ];
    //   专业数据请求
    useEffect(()=>{
        highPostlist().then(res=>{
            if(res.code==200){
                setlist([{
                    id:'P0000',
                    name:'全部',
                    parentId:'A0001',
                    children:null
                },...res.data])
            }
        })
    },[])
    // 表格数据请求
    useEffect(()=>{
        cla()
    },[params])
    // 请求方法
    const cla = () =>{
        selectStationNewVersionList(params).then(res=>{
            if(res.code==200){
                setdataSource(res.data)
            }
        })
    }
    return <div>
        <div className={style.head}>
           <div>
               <div>专业:</div>
               <div>
                    {
                        list.map((item,index)=>{
                            return <span 
                            key={item.id}
                            className={id==index?style.vss:''}
                            onClick={()=>{
                                setid(index)
                                setparams({...params,majorId:item.id})
                            }}
                            >{item.name}</span>
                        })
                    }
               </div>
           </div>
        </div>
        <div className={style.mian}>
          <div><Search placeholder="搜索岗位" allowClear onSearch={onSearch} style={{ width: 200 }} /></div>
          <div><Table dataSource={dataSource}  columns={columns} /></div>
        </div>
    </div>
}
export default highPost